import React, { PureComponent } from 'react'
import { SwitchTransition, CSSTransition } from 'react-transition-group'
import './style.css'
export class App extends PureComponent {
  constructor() {
    super()
    this.state = {
      isLogin: false
    }
  }
  render() {
    const {isLogin} = this.state
    return (
      <div>
        <SwitchTransition mode='out-in'>
          <CSSTransition  timeout={1000} key={isLogin ? 'exit' : 'login'} classNames={'login'}>
            <button onClick={e => this.setState({isLogin : !isLogin})}>{ isLogin ? '退出' : '登录'}</button>
          </CSSTransition>
        </SwitchTransition>
      </div>
    )
  }
}

export default App